<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layout :: common_header(~{::title})">
    <title>商品关键词管理-[[${T(com.b2c.erp.DataConfigObject).getInstance().getSysName()}]]</title>

</head>
<body th:replace="layout :: common_body(~{::div.layui-body})">
<div class="layui-body" style="padding:15px;">
    <div class="layui-tab layui-tab-brief" lay-filter="demo">
        <ul class="layui-tab-title">
            <li class="layui-this"><a href="/ecom/goods_keyword_list"><img src="/images/shuzi0.jpeg" width="20px" height="20px" />关键词库</a></li>
            <li><a href="/ecom/goods_style_data_list"><img src="/images/shuzi1.jpeg" width="20px" height="20px" />测款数据</a></li>
            <li><a href="/ecom/goods_img_data_list"><img src="/images/shuzi2.jpeg" width="20px" height="20px" />测图数据</a></li>
            <li><a href="/ecom/goods_style_refer_list"><img src="/images/shuzi3.jpeg" width="20px" height="20px" />选款参考</a></li>
            <li><a href="/ecom/article_list">电商知识库</a></li>
        </ul>
    </div>
    <!-- content starts -->
    <!--    <blockquote class="layui-elem-quote">订单总览</blockquote>-->

    <fieldset class="layui-elem-field">
        <legend>按条件搜索</legend>
        <div class="layui-field-box">
            <form class="layui-form layui-form-pane1" method="get" th:action="@{/ecom/goods_keyword_list}">

                <div class="layui-form-item">
                    <div class="layui-inline">
                        <input type="text" name="keyword" th:value="${keyword}" placeholder="关键词" class="layui-input" autocomplete="off" style="width: 200px">
                    </div>
                    <div class="layui-inline" >
                        <select name="category" id="category">
                            <option value="">类目</option>
                            <option value="牛仔裤">牛仔裤</option>
                        </select>
                        </div>
                        <div class="layui-inline" >
                        <select name="category2" id="category2">
                            <option value="">子类目</option>
                            <option value="未分类">未分类</option>
                            <option th:each="item:${categoryList}" th:value="${item.name}" th:text="${item.name}"></option>
                    
                            
                        </select>
                    </div>
                    <div class="layui-inline">
                        <div class="layui-input-inline">
                            <select name="platform" id="platform">
                                <option value="">平台</option>
                                <option value="TAO">淘宝</option>
                                <option value="PDD">拼多多</option>
                                <option value="DOU">抖音</option>
                            </select>
                        </div>
                    </div>


                    <div class="layui-inline">
                        <button type="submit" class="layui-btn">搜索</button>
                        <i>总共：<span style="color: red" th:text="${totalSize}"></span>条记录</i>
                    </div>
                    <div class="layui-inline">
                        <a href="javascript:;" id="add_keyword" class="layui-btn layui-btn-normal">添加新关键词</a>
                    </div>

                </div>

            </form>
        </div>
    </fieldset>

    <!-- start dd-wrapper -->
    <link rel="stylesheet" href="/goods/order.css"/>
    <div class="dd-wrapper">
        
        <table class="dd-table">
            <tr>
               <th>序号</th>
                <th>关键词</th>
                <th>搜索热度</th>
                <th>点击热度</th>
                <th>点击率</th>
                <th>转化率</th>
                <th>市场平均出价</th>
                <th>数据日期</th>
                <th>类目</th>
                <th>子类目</th>
                <th>平台</th>
                <th>来源</th>
                <th>创建时间</th>
                <th></th>
            </tr>
            <tr th:each="item:${lists}">
               <td th:text="${itemStat.index +1}"></td>

                <td>
                    <p th:text="${item.keyword}"></p>
                </td>
                
                 <td>
                    <p th:if="${item.sousuoredu != null}" th:text="${item.sousuoredu}"></p>
                    <p th:if="${item.sousuoredu == null}" >--</p>
                </td>
                <td>
                    <p th:text="${item.dianjiredu}"></p>
                    <p th:if="${item.dianjiredu == null}" >--</p>
                </td>
                <td>
                    <p th:if="${item.dianjilv != null}" ><b th:text="${item.dianjilv}"></b>%</p>
                    <p th:if="${item.dianjilv == null}" >--</p>
                </td>
                <td>
                    <p th:if="${item.zhifulv != null}" ><b th:text="${item.zhifulv}"></b>%</p>
                    <p th:if="${item.zhifulv == null}" >--</p>
                </td>
                <td><p th:text="${item.shichangchujia}"></p></td>
                <td><p th:text="${item.includeDate}"></p></td>
                <td><p th:text="${item.category}"></p></td>
                <td><p th:text="${item.category2}"></p></td>
                <td><p th:text="${item.platform}"></p></td>
                <td><p th:text="${item.source}"></p></td>
                <td th:text="${item.createTime}"></td>
                <td>
                    <!-- <a th:href="@{/ecom/keyword_data_list(id=${item.id})}">查看关键词数据</a> -->
                    <a class="view_data layui-btn-sm layui-btn-primary" href="javascript:;" th:attr="data-id=${item.id}">查看关键词数据</a>
                    <a class="add_keyword layui-btn-sm layui-btn-primary" href="javascript:;" th:attr="data-id=${item.id}">添加关键词数据</a>
                </td>
            </tr>
        </table>
    </div>
    <!-- end dd-wrapper -->
    <div class="layui-box layui-laypage layui-laypage-default pageBox">
        <paging:pager th:value="${pageIndex}" th:rows="${totalSize}" th:size="${pageSize}"/>
    </div>


    <script type="text/javascript">
        var layer;
        var $;
        var windowOpen;


        layui.use(['laydate', 'jquery', 'form', 'layer'], function () {
            var laydate = layui.laydate;
            $ = layui.jquery;
            var form = layui.form;
            layer = layui.layer;
            laydate.render({
                elem: '#startTime'
                ,type:'year'
            });

          
            var category = '[[${category}]]';
            var category2 = '[[${category2}]]';
            var platform = '[[${platform}]]';
            $("#platform").val(platform);
            $("#category").val(category);
            $("#category2").val(category2);
            form.render();

            $(function () {
                $("#add_keyword").click(function(){
                    layer.open({
                        type: 2,
                        title: '添加新关键词',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['600px', '65%'],
                        content: '/ecom/goods_keyword_add'
                    });
                })

                //添加关键词数据
                $(".add_keyword").click(function(){
                    var keywrodId = $(this).attr('data-id');
                    layer.open({
                        type: 2,
                        title: '添加关键词数据',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['600px', '65%'],
                        content: '/ecom/goods_keyword_data_add?id='+keywrodId
                    });
                })

                //查看关键词数据
                $(".view_data").click(function(){
                    var keywrodId = $(this).attr('data-id');
                    layer.open({
                        type: 2,
                        title: '关键词数据',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['1000px', '65%'],
                        content: '/ecom/goods_keyword_data_list?id='+keywrodId
                    });
                })



            })
        });


    </script>


</div>
</body>
</html>
